iT邦幫忙

第 11 屆 iThome 鐵人賽

DAY 12
1
自我挑戰組

一週程式專案挑戰系列 第 12

[專案02]自製踩地雷(五)隨機地雷放置完成

  • 分享至 

  • xImage
  •  

多虧ccutmis大幫忙地雷安裝完成,明天要處理數字部分。

【大綱】

  • 程式實作
  • JS let

【程式實作】

參考:ccutmis大提供js洗牌函式

建立地圖

原本「maxwd=9」,
改成「mapsize=3」。
因為3x3地圖不是一列可以解決,
而是需要三列資料,
也就是一維陣列轉成二維陣列。

<!-- 建立地圖 -->
	var map = document.getElementsByClassName("map");
	var wd,mapsize;
	mapsize=3;

地圖初始化&放置地雷

一開始預設為未知狀態(0),
之後再放入地雷(*)。

<!-- 放置地雷 -->
	console.log("0:unknow 1:empty 2:number *:boom")
	var boommap=[],randmap=[],boom=[];	
	var boomi,boomj,boomnum;
	boomnum = 2;//地雷數量
// init
	//地圖初始化&放置地雷
	for(let bi=0; bi<mapsize**2; bi++){
		randmap.push(0);
		if(bi<boomnum)randmap[bi]="*";//*=地雷
	}
	

隨機地雷放置完成

//隨機整數
	function getRandInt(max){
	return Math.floor(Math.random()*max);
	}
//隨機地雷位置
	for (let numi=mapsize**2-1;numi>0;numi--){	
		let j = getRandInt(numi+1);
		[randmap[numi],randmap[j]]=[randmap[j],randmap[numi]]
		//console.log("numi:",numi,"j:",j)
	}
	//測試輸出
	randmap.forEach(function(item,index,array){
		console.log("[",index,"]=",item);
	});

https://ithelp.ithome.com.tw/upload/images/20190913/200919109V1CqehHpo.jpg

把地雷周圍更改數字

數字部分還沒完成

//把地雷周圍更改數字
	//randmap 1d轉2d boommap
	for(let i=0; i<mapsize; i++){
		boommap.push(randmap.splice(0,3));
	}
	console.log(boommap);

藍框是有變動地方
紅框是地雷
https://ithelp.ithome.com.tw/upload/images/20190913/20091910TiSvEb4Ryx.jpg


【JS let】

以前分不清它和var區別,
現在才知道原來let是區域變數,
var是全域變數。

參考:MDN let

迴圈變數懶得取名會用i,j,k,
但是有時候到z都還不夠用。
這時侯用let
就可以全部用i取名,
還不用擔心會汙染到下一個迴圈。


感謝撥冗閱讀,
有錯誤地方請多指教。


上一篇
[專案02]自製踩地雷(四)隨機地圖製作
下一篇
[專案02]自製踩地雷(六)地圖完成!!
系列文
一週程式專案挑戰26
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言